<template>
  <div id="upcoming">
    <div class="con">
      <div class="header">
        待办事项<span style="margin-left: 10px; color: #fa7355"> ({{ tableData.length }})</span>
      </div>
      <div class="content">
        <el-table
          :data="tableData"
          class="table"
          height="100%"
          ref="jdjgTable"
          @sort-change="sortChange"
          :header-cell-style="{
            padding: '0px',
            background: 'linear-gradient(0deg, #F4F6F9, #EAECF4, #F3F6F9)'
          }"
          :row-class-name="tabRowClassName"
          header-row-class-name="mapTable_th"
        >
          <el-table-column width="60" align="center" type="index" :index="addIndex" label="序号">
            <el-table-column width="60" align="center" type="index" label="检索"> </el-table-column>
          </el-table-column>
          <el-table-column label="待办类型" align="center" width="150">
            <el-table-column width="150" align="center" sortable="custom" prop="todoType">
              <template slot="header" align="center" slot-scope="{}">
                <div class="searchBox" @click.stop>
                  <el-input v-model.trim="searchPositionName" @change="getDataChange()"></el-input>
                </div>
              </template>
              <template slot-scope="scope">
                <div>
                  {{ scope.row.todoType | reviewType }}
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="待办流程" align="center" width="400">
            <el-table-column width="400" align="center" sortable="custom" prop="toDoProcessManLists">
              <template slot="header" align="center" slot-scope="{}">
                <div class="searchBox" @click.stop>
                  <el-input v-model.trim="searchPositionName" @change="getDataChange()"></el-input>
                </div>
              </template>
              <template slot-scope="scope">
                <div>
                  <span> {{ scope.row.launchMan }}(发起人) </span>
                  <i class="iconfont icon-jiantou_xiangyou_o"></i>
                  <span v-for="(item, index) in scope.row.toDoProcessManLists" :key="index">
                    <span :style="item.nowReviewer ? 'color:#FA7355' : ''">
                      {{ item.reviewName }}
                    </span>
                    <i
                      class="iconfont icon-jiantou_xiangyou_o"
                      :style="{
                        display: index + 1 === scope.row.toDoProcessManLists.length ? 'none' : ''
                      }"
                    ></i>
                  </span>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="工程名称" align="center" width="150">
            <el-table-column width="150" align="center" sortable="custom" prop="proName">
              <template slot="header" align="center" slot-scope="{}">
                <div class="searchBox" @click.stop>
                  <el-input v-model.trim="searchPositionName" @change="getDataChange()"></el-input>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="状态" align="center" width="150">
            <el-table-column align="center" prop="reviewState" width="150">
              <template slot-scope="scope">
                <div v-for="(item, index) in scope.row.toDoProcessManLists" :key="index">
                  <span v-if="item.nowReviewer"> 待{{ item.reviewName }}审核 </span>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="发起人" align="center" width="180">
            <el-table-column width="180" align="center" sortable="custom" prop="launchMan">
              <template slot="header" align="center" slot-scope="{}">
                <div class="searchBox" @click.stop>
                  <el-input v-model.trim="searchPositionName" @change="getDataChange()"></el-input>
                </div>
              </template>
            </el-table-column>
          </el-table-column>

          <el-table-column label="发起日期" align="center" width="180">
            <el-table-column width="180" align="center" sortable="custom" prop="launch">
              <template slot="header" align="center" slot-scope="{}">
                <div class="searchBox" @click.stop>
                  <el-date-picker v-model.trim="value1" type="date" placeholder="选择日期"> </el-date-picker>
                </div>
              </template>
            </el-table-column>
          </el-table-column>

          <el-table-column label="操作" align="center" fixed="right" width="130">
            <el-table-column align="center" width="130">
              <template slot-scope="scope">
                <div class="">
                  <el-button type="text" class="ty czBtn" size="small" @click="handleClick('处理', scope.row)">
                    处理
                  </el-button>
                  <el-button type="text" class="xg czBtn" size="small" @click="handleClick('查看', scope.row)">
                    查看
                  </el-button>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <!-- 查看合同对话框 -->
    <el-dialog
      width="1200px"
      :center="true"
      :title="title"
      v-if="conVisible"
      :before-close="closeDialog"
      :close-on-click-modal="false"
      :visible.sync="conVisible"
    >
      <contract-from
        :check="true"
        :create="false"
        :checkEff="checkEff"
        :historyObj="biddFrom"
        :componyType="enterpriseType == 1 ? true : false"
      ></contract-from>
    </el-dialog>
    <!-- 处理审核对话框 -->
    <el-dialog
      width=""
      class="review"
      v-if="dealVisible"
      :center="true"
      :close-on-click-modal="false"
      :title="'处理审核'"
      :before-close="closeDialog"
      :visible.sync="dealVisible"
    >
      <div>
        <h1 style="margin-top: 0">审核状态</h1>
        <div class="steps">
          <div class="success">
            <el-image style="width: 46px; height: 46px; margin-bottom: 20px" :src="require('../../assets/success.png')">
            </el-image>
            <p style="color: #333; margin-bottom: 10px">{{ currentBusiness }}提交审核</p>
            <p style="color: #999">{{ subTime }}</p>
          </div>
          <div class="step-item" v-for="(item, index) in reviewList" :key="index">
            <el-image
              style="margin-bottom: 20px"
              :src="require('../../assets/pending_review.png')"
              v-if="item.nowReviewer"
            >
            </el-image>
            <el-image style="margin-bottom: 20px" :src="require('../../assets/review_pass.png')" v-else> </el-image>
            <p style="color: #333; margin-bottom: 10px">
              {{ item.nowReviewer ? '待您审核' : item.reviewName + '审核通过' }}
            </p>
            <p class="item-border"></p>
          </div>
        </div>
        <h1>审核内容</h1>
        <div>
          <span style="color: #fa7355; cursor: pointer" @click="goBiddDetail">查看详情</span>
        </div>
        <h1>审核结果 <span>（若选择驳回，则需要填写驳回理由）</span></h1>
        <div>
          <el-radio v-model.trim="radio" label="1">通过</el-radio>
          <el-radio v-model.trim="radio" label="2">驳回</el-radio>
        </div>
        <div v-if="radio == '1' && reviewType === 12 && enterpriseType == '2'">
          <h1>联系方式</h1>
          <el-form class="commonFrom" label-width="130px" style="margin: 16px 0">
            <el-form-item label="供应商联系人：" style="margin-bottom: 0 !important; margin-right: 20px">
              <el-input
                style="width: 280px"
                class="no_border"
                disabled
                size="small"
                placeholder="请选择供应商联系人"
                v-model.trim="supplierContact"
              >
                <el-button @click="personnelSelect('supplier', '')" slot="append">选择</el-button>
              </el-input>
            </el-form-item>
            <el-form-item label="供应商联系电话：" style="margin-bottom: 0 !important; margin-left: 100px">
              <div>
                {{ scTechnologyPhone || '--' }}
              </div>
            </el-form-item>
          </el-form>
        </div>
        <div v-if="radio == '1' && reviewType === 18 && !this.originatorCompany">
          <h1>联系方式</h1>
          <el-form class="commonFrom" label-width="130px" style="margin: 16px 0">
            <el-form-item
              :label="enterpriseType == 1 ? '付款联系人：' : '收款联系人：'"
              style="margin-bottom: 0 !important; margin-right: 20px"
            >
              <el-input
                style="width: 280px"
                class="no_border"
                disabled
                size="small"
                placeholder="请选择联系人"
                v-model.trim="supplierContact"
              >
                <el-button @click="personnelSelect('supplier', '')" slot="append">选择</el-button>
              </el-input>
            </el-form-item>
            <el-form-item
              :label="enterpriseType == 1 ? '付款联系电话：' : '收款联系电话：'"
              style="margin-bottom: 0 !important; margin-left: 100px"
            >
              <div>
                {{ scTechnologyPhone || '--' }}
              </div>
            </el-form-item>
          </el-form>
        </div>
        <div v-if="radio == '1' && reviewType === 17 && enterpriseType == '1'">
          <h1>验收清单</h1>
          <el-button size="small" class="commonBtn1" @click="uploadClick('1')">上传附件</el-button>
          <div class="upload-wrap">
            <el-upload
              class="upload-demo"
              :headers="loadHeader"
              multiple
              accept=".doc,.docx,.pdf,.jpg,.png,.xls,.xlsx"
              :action="urlUpload"
              :on-remove="fileRemove"
              :on-success="uploadSuccess"
              :before-upload="beforeUpload"
              :on-exceed="onExceed"
              :file-list="fileList"
            >
              <template slot="trigger">
                <div ref="checklist"></div>
              </template>
            </el-upload>
          </div>
          <h1>现场验收附件</h1>
          <el-button size="small" class="commonBtn1" @click="uploadClick('2')">上传附件</el-button>
          <div class="upload-wrap">
            <el-upload
              class="upload-demo"
              :headers="loadHeader"
              multiple
              accept=".jpg,.png"
              :action="urlUpload"
              :on-remove="fileRemove"
              :on-success="uploadSuccessTwo"
              :before-upload="beforeUploadTwo"
              :on-exceed="onExceed"
              :file-list="siteFileList"
            >
              <template slot="trigger">
                <div ref="site"></div>
              </template>
            </el-upload>
          </div>
        </div>
        <h1>审核意见</h1>
        <div>
          <el-input
            type="textarea"
            :autosize="{ minRows: 3 }"
            placeholder="请输入审核意见"
            v-model.trim="revierOpinion"
          >
          </el-input>
        </div>
        <div style="margin-top: 20px">
          <dialog-footer-button @close="close" @saveName="submitReview"></dialog-footer-button>
        </div>
      </div>
    </el-dialog>
    <!-- 查看招标书对话框 -->
    <el-dialog
      width="1200px"
      v-if="biddVisible"
      :center="true"
      :close-on-click-modal="false"
      :title="'查看招标书'"
      :before-close="closeDialog"
      :visible.sync="biddVisible"
    >
      <check-bidd-from :bidd="biddFrom" :downLoad="2"></check-bidd-from>
    </el-dialog>
    <!-- 查看投标书对话框 -->
    <el-dialog
      v-if="bidVisible"
      class="dialog_detail"
      :center="true"
      :close-on-click-modal="false"
      width="1200px"
      title="查看投标书"
      lock-scroll
      :visible.sync="bidVisible"
    >
      <tender-fill :check="false" :bidFrom="biddFrom" @close="closeBid" ref="tender"></tender-fill>
    </el-dialog>
    <!-- 选择本公司人员对话框 -->
    <el-dialog
      width="765px"
      :center="true"
      append-to-body
      title="选择联系人"
      :close-on-click-modal="false"
      :visible.sync="personVisible"
      v-if="personVisible"
    >
      <personnel-select :type="personType" @close="personClose" :index="reviewerIndex"></personnel-select>
    </el-dialog>
    <!-- 查看申请完成合同对话框 -->
    <el-dialog
      width="1200px"
      :center="true"
      id="successContract"
      title="查看申请完成合同"
      v-if="successVisible"
      :before-close="closeDialog"
      :close-on-click-modal="false"
      :visible.sync="successVisible"
    >
      <h1>合同摘要</h1>
      <el-form label-width="130px" class="commonFrom">
        <el-form-item label="招标编号：" style="margin-bottom: 3px">
          {{ biddFrom.biddingNo }}
        </el-form-item>
        <el-form-item label="合同编号：" style="margin-bottom: 3px">
          {{ biddFrom.contractNo }}
        </el-form-item>
        <el-form-item label="定标说明：" style="margin-bottom: 17px; width: 100% !important">
          {{ biddFrom.reviewMind }}</el-form-item
        >
      </el-form>
      <h1>基本信息</h1>
      <el-form class="commonFrom" label-width="130px">
        <el-form-item label="采购商名称："> {{ biddFrom.enterpriseName }}</el-form-item>
        <el-form-item label="工程名称：" style="width: auto !important">
          <span>{{ biddFrom.proName }}</span>
          <span style="color: #fa7355; cursor: pointer; margin-left: 10px" @click="checkProDetail(biddFrom.proId)"
            >查看详情</span
          >
        </el-form-item>
        <el-form-item label="签约采购商：" class="form-item">
          <div>{{ biddFrom.contractBuyer }}</div>
        </el-form-item>
        <el-form-item label="招标内容：" style="margin-right: 400px"> {{ biddFrom.biddingContent }}</el-form-item>
        <el-form-item label="交付地点：" style="width: 100% !important">
          <div>{{ biddFrom.province }}{{ biddFrom.city }}{{ biddFrom.area }}{{ biddFrom.detailAddress }}</div>
        </el-form-item>
        <el-form-item label="合同形式：" style="width: 100% !important">
          <div>{{ biddFrom.contractForm | contractFormFilter }}</div>
        </el-form-item>
      </el-form>
      <h1>总采购清单</h1>
      <div>
        <div style="margin: 20px 0">
          <p style="margin-bottom: 20px; margin-left: 60px">
            总合计：<span style="font-size: 24px; color: #333; margin-left: 12px">{{
              biddFrom.contractAmount || 'xxxxx'
            }}</span
            >元
          </p>
          <p style="margin-left: 60px">
            已结算：<span style="font-size: 24px; color: #333; margin-left: 12px">{{ biddFrom.acceptedAmount }}</span
            >元
          </p>
        </div>
        <div class="bidding-table" style="margin-bottom: 20px">
          <el-table
            :data="biddListTotal"
            border
            class="bidding"
            ref="jdjgTable"
            :header-cell-style="cellStyle"
            :row-class-name="tabRowClassName"
          >
            <el-table-column width="60" align="center" type="index" label="序号">
              <template slot-scope="scope">
                {{ scope.$index + 1 }}
              </template>
            </el-table-column>
            <el-table-column label="材料名称" align="center" prop="materialName" width="160"> </el-table-column>
            <el-table-column label="规格型号" align="center" prop="model" width="160"> </el-table-column>
            <el-table-column label="单位" align="center" prop="company" width="80"> </el-table-column>
            <el-table-column label="参数指标" align="center" prop="parameterIndex" width="160"> </el-table-column>
            <el-table-column label="品牌产地" align="center" prop="brandOrigin" width="160"> </el-table-column>
            <el-table-column label="数量" align="center" prop="purchaseQuantity" width="120"> </el-table-column>
            <el-table-column label="已验收数量" align="center" prop="quantityReceived" width="180"> </el-table-column>
            <el-table-column label="单价" align="center" prop="unitPrice" width="120"> </el-table-column>
            <el-table-column label="税率(%)" align="center" prop="taxRate" width="80"> </el-table-column>
            <el-table-column label="不含税金额" align="center" prop="excludingTax" width="140"> </el-table-column>
            <el-table-column label="税金" align="center" prop="taxes" width="140"> </el-table-column>
            <el-table-column label="价税合计" align="center" prop="totalPrice" width="160" fixed="right">
            </el-table-column>
          </el-table>
        </div>
      </div>
      <h1>合同履约保证金</h1>
      <el-form class="commonFrom" label-width="130px">
        <el-form-item label="保证金金额："> {{ biddFrom.margin }}(万元) </el-form-item>
        <el-form-item label="保证金完成后退回金额：" label-width="170px">
          {{ biddFrom.depositRefund }}(万元)
        </el-form-item>
      </el-form>
    </el-dialog>
    <!-- 查看工程详情对话框 -->
    <el-dialog
      width="553px"
      :center="true"
      title="工程详情"
      append-to-body
      class="pro_dialog"
      :close-on-click-modal="false"
      :visible.sync="projectVisible"
      v-if="projectVisible"
    >
      <el-form label-width="80px">
        <el-form-item label="工程编号: "> {{ projectFrom.proNo }}</el-form-item>
        <el-form-item label="工程名称: ">
          {{ projectFrom.proName }}
        </el-form-item>
        <el-form-item label="建设单位: ">
          {{ projectFrom.developmentUnit }}
        </el-form-item>
        <el-form-item label="施工单位: ">
          {{ projectFrom.constructUnit }}
        </el-form-item>
        <el-form-item label="监理单位: ">
          {{ projectFrom.constructControlUnit }}
        </el-form-item>
        <el-form-item label="勘察单位: ">
          {{ projectFrom.surveyUnit }}
        </el-form-item>
        <el-form-item label="设计单位: ">
          {{ projectFrom.designUnit }}
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 查看合同历史变更记录对话框 -->
    <el-dialog
      class="history"
      width="1200px"
      :center="true"
      :title="historyTitle"
      v-if="historyVisible"
      :before-close="closeDialog"
      :close-on-click-modal="false"
      :visible.sync="historyVisible"
    >
      <div>
        <el-tabs v-model.trim="activeName">
          <el-tab-pane label="合同详情" name="1">
            <div class="tabs">
              <el-tabs type="border-card" v-model.trim="active" class="histortcon">
                <el-tab-pane v-for="item in contractDetail" :key="item.id" :name="item.id + ''" :label="tabTitle(item)">
                  <contract-from
                    :check="true"
                    :checkEff="true"
                    :componyType="enterpriseType == 1 ? true : false"
                    :create="false"
                    :historyObj="item"
                  >
                  </contract-from>
                </el-tab-pane>
              </el-tabs>
            </div>
          </el-tab-pane>
          <el-tab-pane label="审核记录" name="2">
            <el-table
              :data="auditData"
              border
              class="inventory_table"
              :header-cell-style="{ padding: '0px', background: '#F2F3F7' }"
              :row-class-name="tabRowClassName"
            >
              <el-table-column width="60" align="center" type="index" label="序号">
                <template slot-scope="scope">
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column align="center" label="创建人" prop="founder"> </el-table-column>
              <el-table-column align="center" label="审核意见" prop="auditOpinion"> </el-table-column>
              <el-table-column align="center" label="审核结果" prop="auditResults">
                <template slot-scope="scope">
                  <div>
                    {{ scope.row.auditResults | reviewFilter }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column align="center" label="审核时间" prop="auditTime"> </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-dialog>

    <!-- 查看合同订单对话框 -->
    <el-dialog
      width="1200px"
      :center="true"
      :title="orderTitle"
      v-if="orderVisiable"
      :before-close="closeDialog"
      :close-on-click-modal="false"
      :visible.sync="orderVisiable"
    >
      <check-order-from
        :orderId="orderId"
        :ship="ship"
        :isComplete="false"
        :isHaveReview="false"
        :orderObj="biddFrom"
      ></check-order-from>
    </el-dialog>

    <!-- 查看结算单详情 -->
    <el-dialog
      v-if="settlementVisible"
      class="dialog_detail"
      :center="true"
      :close-on-click-modal="false"
      width="1200px"
      title="查看结算单详情"
      lock-scroll
      :visible.sync="settlementVisible"
    >
      <check-order-settlement-modify :formValue="biddFrom"></check-order-settlement-modify>
    </el-dialog>
  </div>
</template>

<script>
import CheckOrderSettlementModify from '../personal/orderSettlementManage/CheckOrderSettlementModify/index.vue'
import CheckOrderFrom from '../personal/contractOrderManage/components/CheckOrderFrom.vue'
import ContractFrom from '../../components/ContractFrom.vue'
import personnelSelect from '../../components/PersonnelSelect.vue'
import dialogFooterButton from '../../components/dialogFooterButton.vue'
import TenderFill from '../../components/TenderFill.vue'
import CheckBiddFrom from '../personal/biddManage/components/checkBiddFrom.vue'
export default {
  components: {
    dialogFooterButton,
    CheckBiddFrom,
    TenderFill,
    personnelSelect,
    ContractFrom,
    CheckOrderFrom,
    CheckOrderSettlementModify
  },
  data() {
    return {
      settlementVisible: false,
      originatorCompany: null,
      orderId: '',
      ship: false,
      orderVisiable: false,
      orderTitle: '',
      isSite: 0,
      num: 0,
      num2: 0,
      fileSuccessTwo: true,
      fileSuccess: true,
      urlUpload: this.GLOBAL.weburl + '/api/file/upload',
      fileList: [],
      siteFileList: [],
      contractDetail: [],
      auditData: [],
      activeName: '1',
      active: '',
      historyTitle: '',
      historyVisible: false,
      projectFrom: {},
      projectVisible: false,
      checkEff: false,
      title: '',
      successVisible: false,
      conVisible: false,
      radio: '',
      revierOpinion: '',
      reviewId: null,
      reviewType: null,
      subTime: '',
      tableData: [],
      searchPositionName: '',
      value1: '',
      biddFrom: {},
      biddId: null,
      supplierUserId: '',
      supplierContact: '',
      scTechnologyPhone: '',
      bidVisible: false,
      dealVisible: false,
      biddVisible: false,
      personVisible: false,
      reviewList: [],
      personType: '',
      reviewerIndex: '',
      enterpriseType: localStorage.getItem('enterpriseType')
    }
  },
  mounted() {
    // 只有登录了才获取列表
    if (this.$store.state.whetherLogin) {
      this.getData()
      this.$store.dispatch('getMenuList')
    }
  },
  computed: {
    // 上传时添加token验证
    loadHeader() {
      let token = this.common.getCookie('materialsToken')
      const header = {}
      header[this.GLOBAL.tokenName] = token
      return header
    },
    currentBusiness() {
      let business = '采购员'
      if (this.reviewType == 18) {
        if (this.originatorCompany) {
          if (this.enterpriseType == 1) {
            business = '采购商'
          } else {
            business = '供应商'
          }
        } else {
          if (this.enterpriseType == 1) {
            business = '供应商'
          } else {
            business = '采购商'
          }
        }
      }

      return business
    }
  },
  methods: {
    // 触发上传
    uploadClick(val) {
      if (val == '1') {
        this.isSite = 0
        this.$refs.checklist.click()
      } else {
        this.isSite = 1
        this.$refs.site.click()
      }
    },
    // 删除文件
    fileRemove(file, files) {
      // 判断删除的是现场验收的文件还是验收清单文件
      if (this.isSite) {
        this.siteFileList = files
        this.num2 = this.siteFileList.length
      } else {
        this.fileList = files
        this.num = this.fileList.length
      }
    },
    // 文件上传前进行文件大小检测
    beforeUpload(file) {
      // 文件未上传完毕不能提交
      this.fileSuccess = false
      const isLt = file.size / 1024 / 1024 / 10 <= 1
      if (!isLt) {
        this.$message.error('单个文件大小不能超过10M,请检查文件大小并重新尝试')
      }
      return isLt
    },
    // 文件上传前进行文件大小检测
    beforeUploadTwo(file) {
      // 文件未上传完毕不能提交
      this.fileSuccessTwo = false
      const isLt = file.size / 1024 / 1024 / 10 <= 1
      if (!isLt) {
        this.$message.error('单个文件大小不能超过10M,请检查文件大小并重新尝试')
      }
      return isLt
    },
    // 文件上传前判断是否超过同时上传文件个数限制
    onExceed() {
      this.$message.error('最多支持同时上传3个文件，请重新上传')
    },
    // 上传成功时的回调
    uploadSuccess(val, e, el) {
      if (e.response.code != 0) {
        this.$message.error(e.response.msg)
        return false
      }
      this.num++
      // 当num的数值与文件上传的数目相等时，代表上传完成，设置文件上传全部完成
      if (this.num == el.length) {
        this.num = el.length
        this.fileSuccess = true
      }
      clearTimeout(this.timer)
      this.timer = setTimeout(() => {
        this.$message.success('上传成功')
      }, 200)
      this.fileList = el
    },
    uploadSuccessTwo(val, e, el) {
      if (e.response.code != 0) {
        this.$message.error(e.response.msg)
        return false
      }
      this.num2++
      // 当num2的数值与文件上传的数目相等时，代表上传完成，设置文件上传全部完成
      if (this.num2 == el.length) {
        this.num2 = el.length
        this.fileSuccessTwo = true
      }
      clearTimeout(this.timer)
      this.timer = setTimeout(() => {
        this.$message.success('上传成功')
      }, 200)
      this.siteFileList = el
    },
    // tab切换label
    tabTitle(item) {
      let str = ''
      const type = item.type == 1 ? '变更' : '取消'
      const changeState =
        item.changeState == 0
          ? '[未审核]'
          : item.changeState == 1
          ? '[审核通过]'
          : item.changeState == 2
          ? '[审核驳回]'
          : '[审核撤销]'
      // 拼接tab切换选项卡的label
      str = item.createTime + ' ' + item.createBy + ' 申请' + type + changeState
      return str
    },
    // 查看工程详情
    checkProDetail(id) {
      this.projectFrom = {}
      this.$https({
        method: 'post',
        url: '/government/listProjectByProjectId?projectId=' + id
      })
        .then(res => {
          if (res.code === 0) {
            this.projectFrom = res.data
            this.projectVisible = true
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 指定表格某列的样式
    cellStyle({ row, column, rowIndex, columnIndex }) {
      if (rowIndex === 0 && columnIndex === 7) {
        //指定坐标
        return 'background: #fff4f2'
      } else {
        return { padding: '0px', background: '#F2F3F7' }
      }
    },
    //选择人员弹窗关闭
    personClose(e) {
      if (this.personType == 'supplier') {
        this.supplierContact = e.userName
        this.scTechnologyPhone = e.phone
        this.supplierUserId = e.id
      }
      this.personVisible = false
    },
    //选择联系人
    personnelSelect(type, index) {
      this.reviewerIndex = index
      this.personVisible = true
      this.personType = type
    },
    closeBid() {
      this.bidVisible = false
    },
    // 提交审核
    submitReview() {
      if (!this.fileSuccess || !this.fileSuccessTwo) {
        this.$message.error('请等待文件上传完毕')
        return false
      }

      if (this.radio === '1') {
        if (this.reviewType === 12 && !this.supplierUserId && this.enterpriseType == '2') {
          this.$message.error('请选择供应商联系人')
          return false
        } else if (this.reviewType === 17 && this.enterpriseType == '1') {
          if (!this.fileList.length) {
            this.$message.error('请上传验收清单')
            return false
          } else if (!this.siteFileList.length) {
            this.$message.error('请上传现场验收附件')
            return false
          }
        } else if (this.reviewType === 18 && !this.originatorCompany && !this.supplierUserId) {
          // 审核类型为18并且当前审核人所在企业不为发布企业,联系人为空
          this.$message.error('请选择联系人')
          return false
        }
        this.saveReview()
      } else if (this.radio === '2') {
        if (this.revierOpinion) {
          this.saveReview()
        } else {
          this.$message.error('请在审核意见处填写驳回理由')
        }
      } else {
        this.$message.error('请选择审核结果')
      }
    },
    saveReview() {
      let siteurl = ''
      let acceptListUrl = ''
      // 审核类型为验收审核时将文件列表转字符串存储
      if (this.reviewType == 17) {
        siteurl = JSON.stringify(this.siteFileList)
        acceptListUrl = JSON.stringify(this.fileList)
      }

      this.$https({
        method: 'post',
        url: '/todoList/handleToDo',
        data: {
          acceptAttachUrl: siteurl,
          acceptListUrl: acceptListUrl,
          agree: this.radio == '1' ? true : false,
          id: this.reviewId,
          suggestion: this.revierOpinion,
          toDoType: this.reviewType,
          supplierUserId: this.supplierUserId,
          supplierContact: this.supplierContact,
          scTechnologyPhone: this.scTechnologyPhone
        }
      })
        .then(res => {
          if (res.code === 0) {
            this.reviewId = null
            this.dealVisible = false
            this.revierOpinion = ''
            this.radio = ''
            this.reviewList = []
            this.fileList = []
            this.siteFileList = []
            this.num = 0
            this.num2 = 0
            this.$message.success('审核成功')
            this.getData()
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    goBiddDetail() {
      this.getDetail(this.reviewId, this.reviewType)
    },
    // 根据待办id查询详情
    getDetail(id, type) {
      this.biddFrom = {}
      this.$https({
        method: 'post',
        url: '/todoList/showToDoInfo/?toDoId=' + id
      }).then(res => {
        if (res.code === 0) {
          // 详情集合
          this.biddFrom = res.data
          // 打开详情对话框
          if (type === 12 || type === 13 || type === 14) {
            switch (type) {
              case 12:
                this.title = '查看合同'
                this.checkEff = false
                this.conVisible = true
                break
              case 13:
                this.biddFrom = []
                this.auditData = res.data.changeAuditRecordVoList
                this.contractDetail = res.data.queryContractChangeVoList
                this.active = res.data.queryContractChangeVoList[0].id + ''
                this.historyTitle = '查看变更/取消合同'
                this.historyVisible = true
                break
              case 14:
                this.biddListTotal = [...(res.data.withinTheContract || []), ...(res.data.outsideTheContract || [])]
                this.successVisible = true
                break
              default:
                break
            }
            return false
          }
          if (type == 16) {
            this.orderTitle = '合同订单查看'
            this.orderVisiable = true
            this.ship = false
            return false
          } else if (type == 17) {
            this.orderTitle = '合同订单验收查看'
            this.orderVisiable = true
            this.ship = true
            return false
          } else if (type == 18) {
            this.settlementVisible = true
            return false
          }
          if (type === -1) {
            this.bidVisible = true
          } else {
            this.biddVisible = true
          }
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    // 获取待办事项的列表
    getData() {
      this.$https({
        method: 'post',
        url: '/todoList/handleList',
        data: {}
      })
        .then(res => {
          if (res.code === 0) {
            if (res.data) {
              this.tableData = res.data
            } else {
              this.tableData = []
            }
            this.$store.commit('setUpcoming', res.data || [])
          } else {
            this.$message.error(res.msg)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    close() {
      this.dealVisible = false
    },
    closeDialog(done) {
      done()
    },
    handleClick(val, scope) {
      // 处理按钮点击时
      if (val === '处理') {
        // 待办id
        this.reviewId = scope.id
        // 待办类型
        this.reviewType = scope.todoType
        // 当前审核人企业是否是发布企业
        this.originatorCompany = scope.originatorCompany || null
        this.dealVisible = true
        // 采购员提交时间
        this.subTime = scope.launch
        // 审核人列表截取，只显示到当前审核人
        scope.toDoProcessManLists.forEach((element, index) => {
          if (element.nowReviewer) {
            this.reviewList = scope.toDoProcessManLists.slice(index, index + 1)
          }
        })
      } else {
        this.getDetail(scope.id, scope.todoType)
      }
    },
    sortChange() {},
    addIndex(index) {
      return index + 1 + (this.page - 1) * this.size
    },
    tabRowClassName({ row, rowIndex }) {
      let index = rowIndex + 1
      if (index % 2 == 0) {
        return 'warning-row'
      }
    }
  },
  filters: {
    contractFormFilter(val) {
      switch (val) {
        case 1:
          return '固定总价'
        case 2:
          return '固定单价'
        case 3:
          return '可调总价'
        case 4:
          return '可调单价'
        case 5:
          return '用户自定义'
        default:
          break
      }
    },
    reviewType(val) {
      switch (val) {
        case -1:
          return '投标审核'
        case 1:
          return '采购审核'
        case 4:
          return '入围审核'
        case 6:
          return '入围后定标审核'
        case 8:
          return '定标后流标审核'
        case 10:
          return '直接定标审核'
        case 11:
          return '直接流标审核'
        case 12:
          return '合同审核'
        case 13:
          return '变更/取消合同审核'
        case 14:
          return '申请完成合同审核'
        case 16:
          return '合同订单审核'
        case 17:
          return '订单验收审核'
        case 18:
          return '结算单审核'
        default:
          break
      }
    },
    reviewFilter(val) {
      switch (val) {
        case 0:
          return '未审核'
        case 1:
          return '通过'
        case 2:
          return '驳回'
        case 3:
          return '撤销'
        default:
          break
      }
    }
  }
}
</script>
<style lang="less">
#upcoming {
  .el-step__title {
    color: #333;
  }
  .el-step__description {
    color: #999;
    font-size: 14px;
  }
  // thead {
  //   &:last-child {
  //     background-color: #fff !important;
  //   }
  // }
  .el-upload {
    display: none !important;
  }
  .el-upload-list {
    display: flex;
    align-items: center;
    width: 600px;
    flex-wrap: wrap;
    .el-upload-list__item {
      width: 260px;
      margin: 20px 30px 0 0;
      background: #f0f1f2;
      border: 1px solid #d6d6d6;
    }
    .el-upload-list__item.is-success .el-upload-list__item-status-label {
      display: none;
    }
    .el-upload-list__item .el-icon-close {
      display: none;
      &:hover {
        display: none;
      }
    }
    .el-upload-list__item .el-icon-close-tip {
      display: none;
      &:hover {
        display: none;
      }
    }
  }
  .el-form-item__label-wrap {
    margin-left: 0 !important;
  }
}
</style>
<style lang="less" scoped>
.history {
  /deep/ .el-tabs__header {
    margin: 0 0 30px !important;
  }
  .histortcon {
    /deep/.el-tabs__header {
      background-color: #fff;
    }
    /deep/ .el-tabs__item {
      border: 1px solid #ebebeb;
      border-bottom: none;
    }
  }
  /deep/ .el-tabs__nav-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 20px;
    border-right: 1px solid #ebebeb;
  }
  /deep/ .el-tabs__nav-next {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    width: 20px;
    border-left: 1px solid #ebebeb;
  }
  .tab-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 16px;
    border-bottom: 1px solid #ebebeb;
    /deep/ .el-tabs__nav-wrap::after {
      height: 0;
    }
    /deep/ .el-tabs__item {
      height: 60px;
      line-height: 60px;
    }
    /deep/ .el-tabs__header {
      margin: 0;
    }
  }
}
#upcoming {
  display: flex;
  justify-content: center;
  height: calc(100vh - 32px);
  background-color: #f8f8f8;

  .steps {
    display: flex;
  }
  .review {
    .commonFrom {
      margin-top: 7px;
      width: 88%;
      .el-form-item {
        width: 40% !important;
        margin-bottom: 7px !important;
      }
      .form-item {
        width: 100% !important;
        /deep/.el-form-item__content {
          display: flex;
        }
        .el-input {
          width: 260px;
        }
      }

      .performance_text {
        color: #999;
        font-size: 14px;
      }
      .icon-guanbianniu {
        font-size: 16px;
        cursor: pointer;
        margin-left: 10px;
      }
      .icon-guanbianniu:hover {
        color: #fa7355;
      }
    }
    .step-item {
      position: relative;
      width: 150px;
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-left: 20px;
      .item-border {
        position: absolute;
        width: 94px;
        height: 5px;
        background: #ebebeb;
        top: 20px;
        left: -60px;
        z-index: -10;
      }
    }
    .success {
      width: 150px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    .deal-tip {
      color: #fa7355;
    }
    h1 {
      margin: 30px 0 20px;
      font-size: 16px;
      font-weight: 500;
      color: #333;
      padding-left: 10px;
      border-left: 4px solid #fa7355;
      span {
        font-weight: normal;
        color: #999;
      }
    }
    .upload-wrap {
      /deep/.el-upload {
        display: none;
      }
      /deep/.el-upload-list {
        display: flex;
        align-items: center;
        width: 600px;
        flex-wrap: wrap;
        margin-bottom: 20px;
        .el-upload-list__item {
          width: 260px;
          margin: 20px 30px 0 0;
          background: #f0f1f2;
          border: 1px solid #d6d6d6;
        }

        .el-upload-list__item-name:hover {
          color: #fa7355;
        }
        .el-icon-close {
          display: block;
          &:hover {
            display: block;
            color: #fa7355;
          }
        }
      }
    }
  }

  .con {
    width: 1200px;
    height: 100%;
    .header {
      line-height: 40px;
      height: 40px;
    }
    .content {
      height: calc(100% - 80px);
      background-color: #fff;
      padding: 20px;
    }
  }
}
#successContract {
  .commonFrom {
    margin-top: 7px;
    width: 88%;
    .el-form-item {
      width: 40% !important;
      margin-bottom: 7px !important;
    }
    .form-item {
      width: 100% !important;
      /deep/.el-form-item__content {
        display: flex;
      }
      .el-input {
        width: 260px;
      }
    }

    .performance_text {
      color: #999;
      font-size: 14px;
    }
    .icon-guanbianniu {
      font-size: 16px;
      cursor: pointer;
      margin-left: 10px;
    }
    .icon-guanbianniu:hover {
      color: #fa7355;
    }
  }
  h1 {
    font-size: 16px;
    font-weight: 500;
    color: #333;
    padding-left: 10px;
    border-left: 4px solid #fa7355;
    span {
      font-weight: normal;
      color: #999;
    }
  }
}
</style>
